<template>
  <div class="father">
    <h1>I`m the father</h1>
    <p>我的身家{{ money }}W元</p>
    名下豪车:<input type="text" v-model="car" />辆
    <p>豪宅{{ house }}栋</p>
    <h3>我儿有女朋友了,名字叫:{{ mysongfname }}</h3>
    <!-- 子传父:在使用子组件的位置监听子组件所发出的事件 -->
    <son :mymoney="money" :soncar="car" @getname="deal"></son>
    <brother></brother>
  </div>
</template>

<script>
import son from "./son";
import brother from "./brother";

export default {
  data() {
    return {
      money: 100,
      car: "",
      house: 11,
      mysongfname: "?",
    };
  },
  components: {
    //注册主键
    son,
    brother,
  },
  methods: {
    // 子传父
    //这个处理函数有一个默认的参数,就是子组件所传递的数据
    //(调用函数进行处理并接收参数)
    deal(data) {
      console.log(data);
      this.mysongfname = data.name;
    },
  },
};
</script>

<style lang="less" scoped>
.father {
  width: 100%;
  background-color: pink;
  padding: 10px;
}
</style>
